<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">
    <h:head>
        <title>
	        <ui:insert name="title">ACUMAAF - SIAF 2.0</ui:insert>
        </title>
    </h:head>
	<h:body>
    	<p:layout fullPage="true" onResizeComplete="true">
		    <!-- LAYOUT DO TOPO DA PÁGINA -->
			<p:layoutUnit position="top" resizable="false" height="150" style=" background-image: url('../images/bg.png')">
				<ui:include src="/componentes/layout_menu_doc_top.xhtml"/>
				<p:graphicImage url="/images/layout-top-atividade-fisica2.png" style="height:90px;"/>
			</p:layoutUnit>
       		<!-- LAYOUT DO LADO ESQUERDO DA PÁGINA -->
       		<p:layoutUnit position="left" header="Calendário  e Programações" resizable="false" width="250">
        		<ui:include src="/componentes/layout_esquerdo.xhtml" />
       		</p:layoutUnit>
       		<!-- LAYOUT DO LADO DIREITO DA PÁGINA -->
       		<p:layoutUnit position="right" header="Galeria de Imagens" resizable="false" width="250">
        		<ui:include src="/componentes/layout_direito.xhtml" />
        	</p:layoutUnit>
        	<!-- LAYOUT DO CENTRO DA PÁGINA -->
       		<p:layoutUnit position="center" id="centro" resizable="true"  scrollable="true" width="250">
       			<h:form>
       				<p:panel header="Central de Monitoramento" style="margin-left: auto; margin-right: auto; width:835px;">
       					<p:panel header="Sessão de Atividade Física">
	       					<h:panelGrid columns="1" >
					    	    <h:outputText value="Grupo de Atividade Física: Grupo de Caminhada" />
					            <h:outputText value="Data: 12/06/2011" />
					            <h:outputText value="Hora: 08:00 - 09:00" />
					            <h:outputText value="Local: USF Água Vermelha" />
					            <h:outputText value="Profissional de Saúde: Renato Mesa" />
					        </h:panelGrid>
					    </p:panel>        
       					<h:panelGrid columns="5" style="margin-left: auto; margin-right: auto;">
					        <p:panel id="participante_1" header="Participante 1">
					            <h:outputText value="Nome: Cláudio" />
					            <br /><h:outputText value="Pressãro Arterial: 122x83" />
					            <br /><h:outputText value="Batimentos Cardíacos: 93" />
					        </p:panel>
					        <p:panel id="participante_2" header="Participante 2">
					            <h:outputText value="Nome: João" />
					            <br /><h:outputText value="Pressãro Arterial: 132x87" />
					            <br /><h:outputText value="Batimentos Cardíacos: 88" />
					        </p:panel>
					        <p:panel id="participante_3" header="Participante 3">
					            <h:outputText value="Nome: Fonseca" />
					            <br /><h:outputText value="Pressãro Arterial: 120x80" />
					            <br /><h:outputText value="Batimentos Cardíacos: 90" />
					        </p:panel>
					        <p:panel id="participante_4" header="Participante 4">
					            <h:outputText value="Nome: Marcela" />
					            <br /><h:outputText value="Pressãro Arterial: 118x78" />
					            <br /><h:outputText value="Batimentos Cardíacos: 95" />
					        </p:panel>
					        <p:panel id="participante_5" header="Participante 5">
					            <h:outputText value="Nome: Gustavo" />
					            <br /><h:outputText value="Pressãro Arterial: 120x80" />
					            <br /><h:outputText value="Batimentos Cardíacos: 100" />
					        </p:panel>
					    </h:panelGrid>
					    <h:panelGrid columns="5" style="margin-left: auto; margin-right: auto;">
					        <p:panel id="participante_6" header="Participante 6">
					            <h:outputText value="Nome: Antônio" />
					            <br /><h:outputText value="Pressãro Arterial: 125x84" />
					            <br /><h:outputText value="Batimentos Cardíacos: 98" />
					        </p:panel>
					        <p:panel id="participante_7" header="Participante 7">
					            <h:outputText value="Nome: Maria" />
					            <br /><h:outputText value="Pressãro Arterial: 120x78" />
					            <br /><h:outputText value="Batimentos Cardíacos: 101" />
					        </p:panel>
					        <p:panel id="participante_8" header="Participante 8">
					            <h:outputText value="Nome: Pedro" />
					            <br /><h:outputText value="Pressãro Arterial: 120x80" />
					            <br /><h:outputText value="Batimentos Cardíacos: 90" />
					        </p:panel>
					        <p:panel id="participante_9" header="Participante 9">
					            <h:outputText value="Nome: Nilda" />
					            <br /><h:outputText value="Pressãro Arterial: 127x87" />
					            <br /><h:outputText value="Batimentos Cardíacos: 107" />
					        </p:panel>
					        <p:panel id="participante_10" header="Participante 10">
					            <h:outputText value="Nome: Matilde" />
					            <br /><h:outputText value="Pressãro Arterial: 118x77" />
					            <br /><h:outputText value="Batimentos Cardíacos: 103" />
					        </p:panel>
					    </h:panelGrid>
       				</p:panel>    
				</h:form>
 		   	</p:layoutUnit>
 		   	<!-- LAYOUT DO RODAPÉ DA PÁGINA -->
       		<p:layoutUnit position="bottom" resizable="false" height="60" style="background-image: url('../images/bg.png')">
        		<ui:include src="/componentes/layout_rodape.xhtml" />
       		</p:layoutUnit>
    	</p:layout>
	</h:body>
</html>